<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	import="java.util.*"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="static/jquery/jquery-2.2.4.min.js" type="text/javascript"></script>
<link rel="stylesheet"
	href="static/bootstrap/css/3.3.6/bootstrap.min.css">
	<link rel="stylesheet" href="static/H+/css/style.min.css">
<script src="static/bootstrap/js/3.3.6/bootstrap.min.js"
	type="text/javascript"></script>
</head>
<style>
body {
	background-image: url(./static/img/background.jpg);
	font-size: 14px;
	font-family: "微软雅黑"
}

.inp {
	width: 350px;
}

.basicInfo {
	width: 600px;
	margin: 0px auto;
}



#info {
	width: 300px;
}
.photo {
	float: right;
	margin-right: 80px;
}
.photo>img:hover {
	-webkit-transform: rotateZ(360deg);
	-moz-transform: rotateZ(360deg);
	-o-transform: rotateZ(360deg);
	-ms-transform: rotateZ(360deg);
	transform: rotateZ(360deg);
}

.photo>img {
	height: 80px;
	width: 80px;
	-webkit-background-size: 220px 220px;
	border-radius: 60px;
	-webkit-transition: -webkit-transform 1s linear;
	-moz-transition: -moz-transform 1s linear;
	-o-transition: -o-transform 1s linear;
	-ms-transition: -ms-transform 1s linear;
}
a:hover{
color: #C40000; 
}
</style>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<body>
	<div class="nav" style="background-color:#663366;">
	<ul class="nav nav-pills" >
		<li><a href="index.jsp">Index</a></li>
		<li class="active"><a href="./showDetail">用户资料</a></li>
		<li><a href="./listCar">全部汽车</a></li>
		<li><a href="addCar.jsp">添加汽车</a></li>
		<li><a href="searchCar.jsp">搜索汽车</a></li>
		<li><a href="searchUser.jsp">搜索用户</a></li>
		<li><a href="about.jsp">关于本站</a></li>
	</ul>
	</div>
	<div class="photo">
		<img src=${user.getImgUrl()}>
	</div>

	<div class="container" style="margin-top: 20px;">
		<div class="row clearfix">
			<div class="col-md-6 column">
				<div class="panel panel-primary" style="margin-top: 30px;">
					<div class="panel-heading" style="font-family: 微软雅黑;">

						<h2 class="panel-title">
							<span class="icon"> <img src="static/img/admin.png">
							</span>基本信息
							</h3>
					</div>
					<div class="panel-body" style="background-color: #99cccc">
						<dl class="info">
							<dt>车主编号</dt>
							<dd>${user.getUserId()}</dd>
						</dl>
						<dl class="info">
							<dt>车主姓名</dt>
							<dd>${user.getUserName()}</dd>
						</dl>
						<dl class="info">
							<dt>性别</dt>
							<dd>${user.getGender()}</dd>
						</dl>
						<dl class="info">
							<dt>联系方式</dt>
							<dd>${user.getUserPhone()}</dd>
						</dl>
					</div>
				</div>
				<span class="label label-primary">有钱人</span>
				<span class="label label-primary">大佬</span>
				 <span class="label label-warning">奥拓爱好者</span>
			</div>
			<div class="col-md-6 column">
			<blockquote>
				<p style="font-size:20px;color:rgb(196,216,226);">
					哪里有大佬，我只是把别人喝咖啡的时间拿来写算法了
				</p> <small>By <cite>Dalao Hu</cite></small>
			</blockquote>
			
				<div class="panel panel-success" style="margin-top: 60px;">
					<div class="panel-heading" style="font-family: 微软雅黑;">
						<h2 class="panel-title">
							<span class="icon"> <img src="static/img/admin.png">详细信息
								</h3>
					</div>
					<div class="panel-body" style="background-color: #99cc99">
						<dl class="info">
							<dt>爱好</dt>
							<dd>${user.getHobbies()}</dd>
						</dl>
						<dl class="info">
							<dt>生日</dt>
							<dd>${user.getBirthday()}</dd>
						</dl>
						<dl class="info">
							<dt>简介</dt>
							<dd>${user.getDescription()}</dd>
						</dl>
					</div>


				</div>
			</div>
			<div id="updatebutton" style="float: right; margin-right: 30px;">
				<button class="btn btn-primary btn-lg" data-toggle="modal"
					data-target="#myModal">修改</button>
			</div>
		</div>
	</div>


	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">编辑信息</h4>
				</div>
				<div
					style="width: 400px; margin-left: 30px; margin-right: 100px; margin-top: 30px;">
					<form id="EditForm" class="form-horizontal" action="updateUserInfo"
						method="post">

						<div class="form-group">
							<label class="col-sm-2 control-label">爱好</label>
							<div class="col-sm-10">
								<div class="inp">
									<input type="text" name="hobbies" value="${user.getHobbies()}"
										class="form-control">
								</div>
							</div>
						</div>

						<div class="form-group">
							<label class="col-sm-2 control-label">生日</label>
							<div class="col-sm-10">
								<div class="inp">
									<input type="text" name="birthday"
										value="${user.getBirthday()}" class="form-control">
								</div>
							</div>
						</div>

						<div class="form-group">
							<label class="col-sm-2 control-label">简介</label>
							<div class="col-sm-10">
								<textarea name="descrption" class="form-control" rows="3" style="width: 400px;"></textarea>
							</div>
						</div>
				</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="submit" class="btn btn-primary" form="EditForm">提交</button>
			</div>
		</div>
	</div>
	</div>

</body>
